<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<title>免费通话记录</title>
		<link rel="stylesheet" type="text/css" href="../../css/bootstrap.min.css" />
		<link rel="stylesheet" type="text/css" href="../../css/base.css" />
		<link rel="stylesheet" type="text/css" href="../../css/my.css">
		<link rel="stylesheet" type="text/css" href="../../css/index.css" />
		<link rel="stylesheet" type="text/css" href="../../css/mianfei/free.css" />
		<script type="text/javascript" src="../../js/jquery-2.1.3.min.js"></script>
		<script type="text/javascript" src="../../js/bootstrap.min.js"></script>
		<script type="text/javascript" src="../../js/laydate.js"></script>
		<script type="text/javascript" src="../../js/loadHtml.js"></script>
		<script type="text/javascript" src="../../js/my.js"></script>
	</head>
	<body>
		<div class="wrapper clearfix">
			<div class="sideBar"></div>
			<div class="main">
				<div class="zixunTop">
					<h1 class="title">免费通话记录</h1>
					<div class="choose">
						<div class="chooseLeft">
							<ul>
								<li>
									<input type="text" placeholder="开始时间" class="inputSize" id="start" />
								</li>
								<li>
									<input type="text" placeholder="结束时间" class="inputSize" id="end" />
								</li>
								<li>
									<input type="text" placeholder="请输入手机号" class="inputSize" />
								</li>
								<li>
									<select class="selectSize" style="margin-left:0;"> 
										<option value="所属科室">所属科室</option>
									</select>
								</li>
								<li>
									<select class="selectSize"> 
										<option value="预约状态">预约状态</option>
									</select>
								</li>
								<li>
									<button class="btn1">
										搜索
									</button>
								</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="tableMain">
					<div class="tableBtn clearfix">
						<button class="btnAdd">批量回访</button>
						<button class="btnAdd">批量删除</button>
					</div>
					<table class="table table-striped">
					<thead>
						<tr>
							<th>
								<input type="checkbox" class="checkBtn" />
							</th>
							<th>提交时间</th>
							<th>预留电话</th>
							<th>所属科室</th>
							<th>症状描述</th>
							<th>预约状态</th>
							<th>操作</th>
						</tr>
					</thead>
					<tbody>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/chakan.png"/>
									<h1>查看</h1>
								</div>
								<div>
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
						<tr>
							<td>
								<input type="checkbox" class="checkAll" />
							</td>
							<td>2016-05-06 12:15</td>
							<td>13356789367</td>
							<td>消化科</td>
							<td>症状描述症状描述...</td>
							<td>未回访</td>
							<td class="last">
								<div style="margin-left:0;">
									<img src="../../img/huifang.png"/>
									<h1>回访</h1>
								</div>
								<div>
									<img src="../../img/del.png" />
									<h1>删除</h1>
								</div>
							</td>
						</tr>
					</tbody>
				</table>
				<ul class="pagination">
  					<li><a href="#">&laquo;</a></li>
  					<li class="active"><a href="#">1</a></li>
  					<li class="disabled"><a href="#">2</a></li>
  					<li><a href="#">3</a></li>
  					<li><a href="#">4</a></li>
  					<li><a href="#">5</a></li>
  					<li><a href="#">&raquo;</a></li>
				</ul>
				</div>
				
				<!-- 弹框内容 1-->
				<div class="alertMain">
					<div class="alertCon">
						<img src="../../img/arrow.png" />
						<h1>删除资讯</h1>
						<p>确定取消该资讯？</p>
						<div>
							<button>保存</button>
							<button>取消</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
</html>
<script type="text/javascript">
	$(function(){
		$('.last div').hover(function(){
			$(this).children('h1').show();
		},function(){
			$(this).children('h1').hide();
		});
		
		$('.pagination li').click(function(){
			$(this).addClass('active').siblings('li').removeClass('active');
		});
		
		$('.table tr').find('.last div:eq(2)').click(function(){
			var alertTop=$(this).offset().top+60;
			$('.alertMain').css({'top':alertTop});
			$('.alertMain').show();
		});
		
		$('.alertCon button:eq(0)').click(function(){
			$('.alertMain').hide();
		});
		
		$('.checkBtn').on("click",function(){
        	
        	$(".checkAll").each(function(){
        		if($(this).prop('checked')==true){
        			$(this).prop("checked",false);
        		}else{
        			$(this).prop("checked",true);
        		}
        	});
        	
        });
	});
</script>
<script type="text/javascript">
    eui.addHandler(window, 'load', function () {
        eui.calendar({
            startYear: 1900,
            input: document.getElementById('start'),
        });
    });
    
    eui.addHandler(window, 'load', function () {
        eui.calendar({
            startYear: 1900,
            input: document.getElementById('end'),
        });
    });
</script>